<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title>商品列表</title>
    <link rel="stylesheet" href="/css/site.min.css"/>
    <link rel="stylesheet" href="/css/style.css"/>
    <script src="/js/jquery-1.11.3.js"></script>
    <script src="/js/bootstrap.min.js"></script>
    <script src="/js/angular.js"></script>
</head>
<body>

<!--导航栏-->


<div style="text-align: center;color: #ff4d4d;"><h1>商品列表</h1></div>
<!--订单管理页面-->
<div class="container" style="margin-top: 30px;color: #000;">
    <!--添加信息-->
    <a href="../../addProduct"><input class="btn  navbar-btn navbar-left close" type="button"
                                   style="width:8em;height:3em;" value="添加商品"></a>
    <a href='javascript:void(0);' onclick="logOut()" class='close'
       style="height: 3em; float: right; margin-right: 1%; padding-top: 8px; margin-top: -80px;">退出</a>
    <!--搜索框-->
    <form class="navbar-form navbar-right" role="search" style="margin-right: 5em;">
        <div class="form-group">
            <input type="text" id="searchInfo" style="border-radius: 20px 0 0 20px;" class="form-control" value="<%=searchInfo%>" placeholder="请输入商品名称">
        </div>
        <input type="button" onclick="goSearch()" class="close" style="height:2.3em;border-radius: 0 20px 20px 0;margin-top: -2px;margin-left: -3px;" value="查询">
    </form>
    <!--信息表-->
    <div class="">
        <table class="table" style="margin-top: 3%;background-color:#ff4d4d;">
            <tr>
                <th style="text-align: center;width:20%;">商品名:</th>
                <th style="text-align: center;width:15%;">规&nbsp;&nbsp;&nbsp;格:</th>
                <th style="text-align: center;width:15%;">单&nbsp;&nbsp;&nbsp;价:</th>
                <th style="text-align: center;width:10%;">状&nbsp;&nbsp;&nbsp;态:</th>
                <th style="width: 30%;padding-left: 7.5em">操&nbsp;&nbsp;&nbsp;作:</th>
            </tr>
            <tbody id="tbList">
            <% for(var i = 0;i < productList.length;i++){ %>
            <tr ng-repeat="">
                <td style="width:20%;text-align: center;"><%= productList[i].pName %></td>
                <td style="text-align: center;width:15%"><%= productList[i].specName %></td>
                <td style="text-align: center;width:15%"><%= productList[i].price %></td>
                <td style="text-align: center;width:10%"><%= productList[i].status == 1 ? "已上架" : "已下架" %></td>
                <td style="width: 30%">
                    <a name="aEdit" class="btn  close_1" type="button" style="height:1.7em;line-height:1em;"
                       href="../../editProduct/<%= productList[i].id %>">修改<input
                                type="hidden" value="<%= productList[i].id %>"/></a>
                    <% if(productList[i].status == 0){ %>
                    <a name="aUp" class="btn  close_1" type="button" style="height:1.7em;line-height:1em;"
                       href="../../editProduct/<%= productList[i].id %>-UP" value=""
                       class="trdelspec">上架</a>
                    <% }else{ %>
                    <a name="aDown" class="btn  close_1" type="button" style="height:1.7em;line-height:1em;"
                       href="../../editProduct/<%= productList[i].id %>-Down" value=""
                       class="trdelspec">下架</a>
                    <% } %>
                    <a class="btn  close_1" type="button" style="height:1.7em;line-height:1em;" value=""
                       href="../../productDetail/<%= productList[i].id %>">详情</a>
                </td>
            </tr>
            <% } %>
            </tbody>

        </table>
        <div style="text-align: center;">
            <ul class="pagination" id="pagination">
                <!--<li>-->
                <!--<a href="#" aria-label="Previous">-->
                <!--<span aria-hidden="true">&laquo;</span>-->
                <!--</a>-->
                <!--<>-->
                <!--<li><a href="#">1</a><>-->
                <!--<li><a href="#">2</a><>-->
                <!--<li><a href="#">3</a><>-->
                <!--<li><a href="#">4</a><>-->
                <!--<li><a href="#">5</a><>-->
                <!--<li>-->
                <!--<a href="#" aria-label="Next">-->
                <!--<span aria-hidden="true">&raquo;</span>-->
                <!--</a>-->
                <!--<>-->
            </ul>
        </div>

    </div>

</div>
<script>
    $(document).ready(function () {
        if ($("#pagination")) {
            var pagecount = '<%=count%>';
            var pagesize = '<%=pagesize%>';
            var currentpage = '<%=pageIndex%>';
            var counts, pagehtml = "";
            if (pagecount % pagesize == 0) {
                counts = parseInt(pagecount / pagesize);
            } else {
                counts = parseInt(pagecount / pagesize) + 1;
            }
            //只有一页内容
            if (pagecount <= pagesize) {
                pagehtml = "";
            }
            //大于一页内容
            if (pagecount > pagesize) {
                if (currentpage > 1) {
                    pagehtml += "<li><a href='../../product/" + (parseInt(currentpage - 1)) + "'>上一页</a></li>";
                }
                for (var i = 0; i < counts; i++) {
                    if (i >= (currentpage - 3) && i < (currentpage + 3)) {
                        if (i == currentpage - 1) {
                            pagehtml += '<li class="active"><a href="../../product/' + (i + 1) + '">' + (i + 1) + '</a></li>';
                        } else {
                            pagehtml += '<li><a href="../../product/' + (i + 1) + '">' + (i + 1) + '</a></li>';
                        }

                    }
                }
                if (currentpage < counts) {
                    pagehtml += '<li><a href="../../product/' + (parseInt(currentpage) + 1) + '">下一页</a></li>';
                }
            }
            $("#pagination").html(pagehtml);
        }

        var url = window.location.href;
        url = url.replace(/\//g, "=");
        $("#tbList tr").each(function () {
            var aEditHref = $("a[name=aEdit]", $(this)).attr("href");
            var aUpHref = $("a[name=aUp]", $(this)).attr("href");
            var aDownHref = $("a[name=aDown]", $(this)).attr("href");
            $("a[name=aEdit]", $(this)).attr("href", aEditHref + "/" + url);
            $("a[name=aUp]", $(this)).attr("href", aUpHref + "/" + url);
            $("a[name=aDown]", $(this)).attr("href", aDownHref + "/" + url);
        })
    });
    function logOut() {
        top.location.href = "../../index/9999";
    }

    function goSearch() {
        var searchInfo = $("#searchInfo").val();
        searchInfo = "/searchInfo:" + searchInfo;
        var url = window.location.href;
        var regPageIndex = /\/product\/\d+$/g;
        var regSearchInfo = /\/searchInfo:/g;
        if (regPageIndex.test(url)) {
            //有分页页码无搜索条件
            url=url.replace(/\/product\/\d+/g,"/product/1");
            url = url + searchInfo;
        } else {
            if (regSearchInfo.test(url)) {
                //有搜索条件,必然有分页页码，要将页码置为1
                url=url.replace(/\/product\/\d+/g,"/product/1");
                url = url.substring(0, url.indexOf("/searchInfo:")) + searchInfo;
            } else {
                //无分页页码,无搜索条件
                url = url + "/1" + searchInfo;
            }
        }
        window.location.href = url;
    }
</script>
</body>
</html>
